<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<script src="js/mui.min.js"></script>

		<link rel="stylesheet" type="text/css" href="css/registLogin/util.css">
		<link rel="stylesheet" type="text/css" href="css/registLogin/main.css">

		<script type="text/javascript" charset="utf-8">
			mui.init();
		</script>

		<style>
			.p-t-85 {
				padding-top: 10px;
			}
			
			.p-b-70 {
				padding-bottom: 35px;
			}
			
			.m-t-85 {
				margin-top: 15px;
			}
			
			.container-login100 {
				padding: 25px;
			}
			/*toast信息提示*/
			
			.mui-toast-container {
				bottom: 50% !important;
			}
			
			.mui-toast-message {
				opacity: 0.6;
				color: #fff;
				width: 180px;
				padding: 70px 5px 10px 5px;
			}
		</style>
	</head>

	<body>

		<div class="mui-content">
			<div class="container-login100">
				<div class="wrap-login100 p-t-85 p-b-20">
					<form id="userform">
						<span class="login100-form-title p-b-70">
							<h5>Netty 实战</h5>
						</span>
						<span class="login100-form-avatar">
							<img id="img_login_face" src="css/registLogin/arrow.jpg" alt="风间影月">
						</span>

						<div class="wrap-input100 validate-input m-t-85 m-b-35">
							<input class="input100" type="text" id="username" name="username" placeholder="用户名">
							<span class="focus-input100"></span>
						</div>

						<div class="wrap-input100 validate-input m-b-50">
							<input class="input100" type="password" id="txt_password" name="password" placeholder="密码">
							<span class="focus-input100"></span>
						</div>
						<div class="container-login100-form-btn">
							<button type="submit" id="registOrLogin" class="login100-form-btn">
								登录/注册
							</button>
						</div>
					</form>

				</div>
			</div>
		</div>
		<script type="text/javascript" src="js/app.js" ></script>
		<script>
			mui.plusReady(function() {
				let userInfo = app.getGlobalUserInfo();
				if(userInfo!=null){
					mui.openWindow("index.html","index");
				}
				
				let userform = document.getElementById("userform");
				let username = document.getElementById("username");
				let userpass = document.getElementById("txt_password");
				userform.addEventListener("submit",function(e){
					if(!app.isNotNull(username.value)){
						app.showToast('用户名不能为空');
						username.focus();
					} else if(!app.isNotNull(userpass.value)){
						app.showToast('密码不能为空');
						userpass.focus();
					} else {
						if (username.value.length>12){
							app.showToast('用户名不能超过16');
							return false;
						} else if (userpass.value.length>12){
							app.showToast('密码不能超过16');
							return false;
						}
					}
					let cid = plus.push.getClientInfo().clientid;
					mui.ajax(app.serverUrl+'/u/registerOrLogin',{
						data:{
							username:username.value,
							password:userpass.value,
							cid:cid,
						},
						dataType:'json',//服务器返回json格式数据
						type:'post',//HTTP请求类型
						timeout:100000,//超时时间设置为100秒；
						headers:{'Content-Type':'application/json'},	              
						success:function(data){
							username.blur();
							userpass.blur();
								
							if(data.status ==200){
								console.log("success: ",JSON.stringify(data));
								// 保存全局用户对象到本地缓存
								let userInfo = data.data;
								console.log(JSON.stringify(userInfo));
								app.setGlobalUserInfo(JSON.stringify(userInfo['username']));
								mui.openWindow("index.html","index");
							} else {
								app.showToast(data.msg,"error");
							}
						},
						error:function(xhr,type,errorThrown){
							//异常处理；
							console.log(type);
						}
						});
					
					e.preventDefault();
				});
			});
		</script>
	</body>

</html>